<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>选择预案</title>
  <link rel="stylesheet" href="./js/elementui/index.css">
  <link rel="stylesheet/less" type="text/css" href="./style.less" >
  <script src="./js/less.min.js"></script>
  <script src="./js/coordtransform.js"></script>
  <script src="//webapi.amap.com/maps?v=1.4.15&key=00762ed534ad78f63087f08da76fc556"></script>
  <script src="//webapi.amap.com/ui/1.1/main.js?v=1.1.1"></script>

</head>

<body>
  <div id="app">
    <amap-picker v-if="pickerType" class="amap-picker" :lnglat="defaultLnglat" @confirm="amapPickerConfirm" style="width: 100vw;height: 100vh;" :picker-type="pickerType" :address="address"></amap-picker>
  </div>
</body>
<script src="./js/jquery-1.11.2.min.js"></script>
<script src="./js/lodash.min.js"></script>
<script src="./js/vue.js"></script>
<script src="./AmapPicker.js"></script>
<script src="./js/elementui/index.js"></script>

<script>
function getQueryString (name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  var r = window.location.search.substr(1).match(reg);
  if (r != null) return decodeURI(r[2]);
  return null;
}
var app = new Vue({
  el: '#app',
  mixins: [],
  data() {
    return {
      defaultLnglat: '',
      lnglat: '',
      pickerType: '',
      address: ''
    };
  },
  methods: {
    amapPickerConfirm: function (data) {
      alert(JSON.stringify(data));
    }
  },
  mounted () {
    this.defaultLnglat = (getQueryString('lnglat') || '120.281073,31.914961').split(',')
    this.pickerType = getQueryString('type') || 'gcj02';
    this.address = getQueryString('address') || '';
  }
});

</script>

</html>
